// Define a Todo Model
var Profile = Backbone.Model.extend({
  // Default todo attribute values
  defaults: {
    title: '',
    completed: false
  },

  initialize: function(){
  	console.log('This model has been initialized.');
	  this.on('change', function(){
	    console.log('- Values for this model have changed.');
	  });

  }  
});

// Instantiate the Todo Model with a title, allowing completed attribute
// to default to false
var myProfile = new Profile({
  title: 'Check attributes property of the logged models in the console.'
});
console.log(JSON.stringify(myProfile));

var ProfileView = Backbone.View.extend({

  tagName: 'ul', // required, but defaults to 'div' if not set
  className: 'container', // optional, you can assign multiple classes to this property like so: 'container homepage'
  id: 'profiles', // optional

  // Cache the template function for a single item.
  todoTpl: _.template( "An example template" ),

  events: {
    'dblclick label': 'edit',
    'keypress .edit': 'updateOnEnter',
    'blur .edit':   'close'
  },

  // Re-render the titles of the todo item.
  render: function() {
    this.$el.html( this.todoTpl( this.model.toJSON() ) );
    this.input = this.$('.edit');
    return this;
  },

  edit: function() {
    // executed when todo label is double clicked
  },

  close: function() {
    // executed when todo loses focus
  },

  updateOnEnter: function( e ) {
    // executed on each keypress when in todo edit mode,
    // but we'll wait for enter to get in action
  }
});

var profileView = new ProfileView();

// log reference to a DOM element that corresponds to the view instance
console.log(profileView.el); // logs <li></li>